<template>
  <div>
    <div class="z"></div>
    <div class="header">
      <div>
        <img src="../assets/logo.png" alt="" srcset="" />
        <div class="pc-ra">
          <router-link
            v-for="(item, index) in list"
            :to="item.path"
            :key="index"
          >
            {{ item.label }}
          </router-link>
        </div>
        <div class="login-box">
          <div>注册</div>
          <div></div>
          <div>登录</div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      list: [
        { path: "/", label: "首页" },
        { path: "/index/check", label: "人才政策一网通查" },
        { path: "/index/declare", label: "人才计划一网申报" },
        { path: "/index/transact", label: "人才服务一网通办" },
        { path: "/index/mall", label: "优惠购" },
        { path: "/index/forum", label: "人才论坛" }
      ]
    };
  },

  created() {},
  methods: {}
};
</script>
<style scoped>
.text {
  width: 100px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.z {
  height: 80px;
}
.header {
  /* position: relative; */
  position: fixed;
  top: 0;
  box-sizing: border-box;
  width: 100%;
  height: 80px;
  font-size: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #333;
  background: #fff;
  z-index: 10;
}
.header img {
  width: 196px;
}
.header >div{
    width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}
.pc-ra {
  display: flex;
  justify-content: center;
  flex: 1;
}
.pc-ra a {
  font-size: 16px;
  color: #333;
  flex: 1;
  text-align: center;
}


.item {
  margin: 0 1.4em;
  font-size: 16px;
  color: #333;
  line-height: 3.5em;
  border-bottom: 5px solid #fff;
}
.item:hover {
  color: #2469b944;
  border-bottom-color: #2469b944;
}
.items {
  margin: 0 1.4em;
  font-size: 16px;
  color: #333;
  line-height: 3.5em;
  color: #2469b9;
  border-bottom: 5px solid #2469b9;
}
.login-box {
  display: flex;
  color: #333;
  font-size: 14px;
  align-items: center;
  margin-left: 46px;
  margin-top: 4px;
}
.login-box > div:nth-child(2) {
  height: 28px;
  width: 1px;
  margin: 0 1em;
  background: #ccc;
}
</style>
